<template>
    <div class="template-index-Lu">
        <commpVxeTable
            :key="reCommpVxeTable"
            :conditionBtnRow="true"
            :config="dataConfig()"
            :columns="columns()"
            :formItem="item()"
            @checkboxChange="checkboxChange"
            ref="administrativeOffice"
            @searchEvent="searchEvent"
            @resetEvent="resetEvent"
            >
            <!-- <template v-slot:lgtime_slot>
                <a-range-picker
                    @change="flgsjChange"
                    v-model="time"
                    :show-time="{
                        hideDisabledOptions: true,
                        defaultValue: [moment('00:00:00', 'HH:mm:ss'), moment('11:59:59', 'HH:mm:ss')],
                    }"
                    format="YYYY-MM-DD HH:mm:ss"
                />
            </template>
            <template v-slot:externalOperations="{data}">
                <vxe-form-item v-if="linkName == '行政事务申请已办'">
                    <template>
                        <a-button class="blue-btn" @click="exportClick">导出</a-button>
                    </template>
                </vxe-form-item>
            </template> -->
            <template v-slot:operation_btn="{row}" data-desc="自定操作栏">
                <a-form layout="inline">
                    <a-form-item>
                        <a-button class="blue-btn" @click="reviseClick(row)">查看</a-button>
                    </a-form-item>
                    <a-form-item>
                        <a-popconfirm
                            title="您确定要撤回这条申请吗?"
                            ok-text="确定"
                            cancel-text="取消"
                            @confirm="returnStartClick(row)"
                            @cancel="cancel"
                            >
                            <a-button v-if="linkName=='我的已办'&&row.fsfkch=='true'" class="red-btn">撤回</a-button>
                        </a-popconfirm>
                    </a-form-item>
                    <a-form-item>
                    </a-form-item>
                </a-form>
            </template>
        </commpVxeTable>
        <applicationForm ref="applicationFormRef" :linkName="linkName" :formData="formData" @success="success"></applicationForm>
    </div>
</template>
<script>
import  assessCheckApi  from './service/api.js'
import  commpVxeTable   from '@/components/commp-vxe-table/commp-vxe-table.vue'
import  applicationForm  from '../index/applicationForm.vue'
import  {queryAllYbJob,returnUpperzdyFlowJob,exportLgqsData,}  from './service/index.js'
import moment from 'moment'
export default {
    components: {
        commpVxeTable,
        applicationForm
    },
    props:{
        linkName:{
            type:String,
            default:'',
            required:false,
        },
        stepNum:{
            type:String,
            default:'',
            required:false,
        }
    },
    data() {
        return {
            moment,
            fhgsj: '',
            flgsj: '',
            time: '',
            stepNums: 0,
            reCommpVxeTable: '',
            dataTableConfig:{
                api: assessCheckApi.list,
                rowId: 'id',
                urlType: true,
                paramet:{
                    flczt: '流程结束'
                }
            },
            dataTableConfigJk: {
                api: assessCheckApi.flowJkPage,
                rowId: 'id',
                urlType: true,
                paramet: {}
            },
            dataTableConfigMe: {
                api: assessCheckApi.myJobPage,
                rowId: 'id',
                urlType: true,
                paramet: {}
            },
            dataTableConfigXiu: {
                api: assessCheckApi.Pagesjxd,
                rowId: 'id',
                urlType: true,
                paramet: {}
            },
            columnsVxe: [
                {
                    type: 'checkbox',
                    width: 60,
                    fixed: 'left'
                },{
                    title: '申请人',
                    field: 'fnbr',
                    width: 100,
                },{
                    title: '申请时间',
                    field: 'fnbsj',
                    width: 150,
                },{
                    title: '事项名称',
                    field: 'fsx',
                },{
                    title: '类别',
                    field: 'flb',
                    width: 100,
                },{
                    title: '自然编号',
                    field: 'fzrbh',
                },{
                    title: '科室领导意见',
                    field: 'fksldyj',
                },{
                    title: '办公室意见',
                    field: 'fbgsyj',
                },{
                    title: '中心领导批示',
                    field: 'fzxld',
                },{
                    title: '操作',
                    field: 'jobid',
                    width: 100,
                    slots: {
                    // 使用插槽模板渲染
                        default: 'operation_btn',
                    },
                }
            ],
            columnsVxeMe: [
                {
                    title: '申请人',
                    field: 'fnbr',
                    width: 100,
                },{
                    title: '拟办时间',
                    field: 'fnbsj',
                    width: 150,
                },{
                    title: '申请部门',
                    field: 'fks',
                    width: 150,
                },{
                    title: '具体内容',
                    field: 'fnbyj',
                },{
                    title: '事项名称',
                    field: 'fsx',
                },{
                    title: '类别',
                    field: 'flb',
                    width: 100,
                },{
                    title: '自然编号',
                    field: 'fzrbh',
                }, {
                    title: '流程状态',
                    field: 'flczt',
                    width: 100,
                },{
                    title: '在办环节',
                    field: 'fhjmc',
                    width: 100,
                },{
                    title: '操作',
                    field: 'jobid',
                    width: 150,
                    slots: {
                    // 使用插槽模板渲染
                        default: 'operation_btn',
                    },
                }
            ],
            columnsVxeL: [
                {
                    type: 'checkbox',
                    width: 60,
                    fixed: 'left'
                },{
                    title: '拟办人',
                    field: 'fnbr',
                    width: 100,
                },{
                    title: '自然编号',
                    field: 'fzrbh',
                },{
                    title: '环节名称',
                    field: 'fhjmc',
                    width: 150,
                },{
                    title: '待办人',
                    field: 'fdbr',
                    width: 150,
                },{
                    title: '事项',
                    field: 'fsx',
                },{
                    title: '类别',
                    field: 'flb',
                    width: 100,
                },{
                    title: '发送时间',
                    field: 'ffssj',
                    width: 100
                },{
                    title: '操作',
                    field: 'jobid',
                    width: 200,
                    slots: {
                    // 使用插槽模板渲染
                        default: 'operation_btn',
                    },
                }
            ],
            formItemL: [
                {
                    label: '离岗时间',
                    model: 'flgsj',
                    slotName:'lgtime_slot'
                },
                {
                    label: '环节名称',
                    model: 'fhjmc',
                    placeholder: '环节名称',
                    type:'Select',
                    dictionaryType:'离岗请示流程'
                },
                {
                    label: '办理状态',
                    model: 'fblzt',
                    type:'Select',
                    options:[{
                        label:'待办',
                        value:'待办'
                    },{
                        label:'已办',
                        value:'已办'
                    }]
                },
            ],
            formItemMe: [
            {
          label: '申请人',
          model: 'fnbr',
        },{
          label: '申请部门',
          model: 'fks',
          placeholder: '申请部门',
          type:'Select',
          dictionaryType:'OA申请科室单位'
        },{
          label: '具体内容',
          model: 'fnbyj',
        },{
          label: '事项名称',
          model: 'fsx',
        },{
          label: '类别',
          model: 'flb',
          placeholder: '类别',
          type:'Select',
          dictionaryType:'OA行政事务审批类别'
        },{
          label: '自然编号',
          model: 'fzrbh',
        },{
          label: '时间',
          model: 'frq',
          slotName:'time_slot'
        },
        // {
        //   label: '发起时间',
        //   model: 'ffssj',
        //   slotName:'lgtime_slot'
        // },
        {
          label: '流程状态',
          model: 'flczt',
          type:'Select',
          options:[{
            label: '流程在办',
            value: '流程在办'
          },{
            label: '流程结束',
            value: '流程结束'
          }]
        },{
          label: '在办环节',
          model: 'fhjmc',
          placeholder: '在办环节',
          type:'Select',
          dictionaryType:'OA行政事务审批流程'
        }
            ],
            formItem: [
                {
                    label: '类别',
                    model: 'flb',
                    placeholder: '类别',
                    type:'Select',
                    dictionaryType:'OA行政事务审批类别'
                },
            ],
            formItemL: [
                {
                    label: '类别',
                    model: 'flb',
                    placeholder: '类别',
                    type:'Select',
                    dictionaryType:'OA行政事务审批类别'
                }
            ],
            idList: [],
            formData: {},
            paramet: {},
            parametMe: {},
            parametJk: {},
            parametXiu: {},
        }
    },
    created() {
        this.paramet = JSON.parse(JSON.stringify(this.dataTableConfig.paramet))
        this.parametMe = JSON.parse(JSON.stringify(this.dataTableConfigMe.paramet))
        this.parametJk = JSON.parse(JSON.stringify(this.dataTableConfigJk.paramet))
        this.parametXiu = JSON.parse(JSON.stringify(this.dataTableConfigXiu.paramet))
    },
    methods: {
        // 勾选
        checkboxChange(val){
            //console.log('已选择',val)
            this.idList = []
            if(val.length){
                val.forEach(item => {
                    this.idList.push(item.id)
                });
            }
        },
        // 离岗时间
        flgsjChange(date, dateString){
            //console.log(date, dateString);
            this.flgsj = dateString[0]
            this.fhgsj = dateString[1]
        },
        dataConfig(){
            let data = {}
            if(this.linkName == '我的已办'){
                data = this.dataTableConfigMe
            } else if (this.linkName == '流程监控'){
                data = this.dataTableConfigJk
            } else if (this.linkName == '行政事务申请已办'){
              data = this.dataTableConfig
            } else if(this.linkName == '数据修订'){
                data = this.dataTableConfigXiu
            }
            return data
        },
        columns(){
            let data = []
            if(this.linkName == '我的已办'){
                data = this.columnsVxeMe
            } else if (this.linkName == '流程监控'){
                data = this.columnsVxeL
            } else if (this.linkName == '行政事务申请已办'){
                data = this.columnsVxe
            } else if(this.linkName == '数据修订'){
                data = this.columnsVxeMe
            }
            return data
        },
        item(){
            let data = []
            if(this.linkName == '我的已办'){
                data = this.formItemMe
            } else if (this.linkName == '流程监控'){
                data = this.formItemL
            } else if (this.linkName == '行政事务申请已办'){
                data = this.formItem
            } else if(this.linkName == '数据修订'){
                data = this.formItemMe
            }
            return data
        },
        // 搜索
        searchEvent(){
            this.dataTableConfig.paramet = {
                ...this.dataTableConfig.paramet,
                fhgsj: this.fhgsj,
                flgsj: this.flgsj,
            }
            //console.log(this.dataTableConfig.paramet)
        },
        // 重置
        resetEvent(){
            this.dataTableConfig.paramet = {
                ...this.dataTableConfig.paramet,
            }
            this.fhgsj = ''
            this.flgsj = ''
            this.time = ''
        },
        // 离岗申请
        addClick(){
            this.$nextTick(_ => {
                this.$refs.applicationFormRef.applicationFormVisible = true
            })
        },
        // 点击办理
        reviseClick(row){
            //console.log('办理',row)
            this.formData = {
                ...row
            }
            let jobid = row.jobid
            // queryJobByJobId({jobid:jobid}).then(res => {
            //     //console.log(res)
            // })
            this.formData.id = row.oaid
            this.$nextTick(_ => {
                this.$refs.applicationFormRef.applicationFormVisible = true
            })
        },
        // 撤回申请
        returnStartClick(row){
            queryAllYbJob({jobid:row.jobid}).then(res => {
                let list = res.result
                list.forEach(item => {
                    if(item.fhjmc == '离岗申请'){
                        this.returnFuntion(row.jobid,item.id)
                    }
                })
            })
        },
        returnFuntion(jobid,ids){
            let data = {
                jobid: jobid,
                opinion: '撤回申请',
                shjid: ids,
                smgflag: '',
                smsContent: '',
            }
            returnUpperzdyFlowJob(data).then(res => {
                if(res.code == 200){
                    that.$message.success(res.message)
                    that.reCommpVxeTable = Date.now()
                } else {
                    that.$message.warning(res.message)
                }
            })
        },
        //
        cancel(e) {
            //console.log(e);
        },
        // 导出
        exportClick(){
        let that = this
        if(that.idList.length == 0){
            that.$message.warning('请选择导出项')
        } else {
            that.$confirm({
            title: '您确定要导出这些记录吗?',
            content: '',
            okText: '确定',
            okType: 'info',
            cancelText: '取消',
            onOk() {
            var fileName = '行政事务审批表'
            let list = that.idList.toString()
            exportLgqsData({ids: list}).then((data) => {
                // //console.log(data)
                if (!data) {
                    that.$message.warning('文件下载失败')
                    return
                }
                if (typeof window.navigator.msSaveBlob !== 'undefined') {
                    window.navigator.msSaveBlob(new Blob([data], { type: 'application/vnd.ms-excel' }), fileName + '.xls')
                } else {
                    let url = window.URL.createObjectURL(new Blob([data], { type: 'application/vnd.ms-excel' }))
                    let link = document.createElement('a')
                    link.style.display = 'none'
                    link.href = url
                    link.setAttribute('download', fileName + '.xls')
                    document.body.appendChild(link)
                    link.click()
                    document.body.removeChild(link) //下载完成移除元素
                    window.URL.revokeObjectURL(url) //释放掉blob对象
                }
            })
            },
            onCancel() {
            //console.log('Cancel');
            },
        });
        }
        // exportLgqsData().then(res => {})
        },
        // 弹窗提交成功
        success(){
            // 刷新表格 清空id数组
            this.$refs.administrativeOffice.resetEvent()
            this.idList = []
        }
    },
}
</script>
<style>
@import url('../../css/oaClass.css');
</style>
